{{extend "base.html"}}

{{block head}}
<script type="text/javascript" charset="utf-8">
	var datagrid;
	$(function() {
		/*
		$('#cr_name').AutoComplete({
			'data': "/idcpost/computerroomsearch2",
			'width': 150
		}).AutoComplete('show');
		*/
		datagrid = $('#grid').datagrid({
			url : '/devicespost/switch',
			title : '',
			iconCls : 'icon-save',
			pagination : true,
			pagePosition : 'bottom',
			pageSize : 20,
			pageList : [ 20, 30, 40 ],
			fit : true,
			fitColumns : false,
			nowrap : false,
			border : false,
			idField : 'id',
			//checkOnSelect : false,
			//selectOnCheck : true,
			//左右滚动条
			frozen:true,
			frozenColumns : [ [ {
				title : '编号',
				field : 'id',
				width : 100,
				sortable : true,
				checkbox : true
			}, {
				title : '交换机别名',
				field : 'switch_aliasname',
				width : 120,
				sortable : true
			}, {
				title : '机房',
				field : 'computerroom_id',
				width : 100,
				sortable : true
			}, {
				title : '机柜',
				field : 'rackspace_id',
				width : 100,
				sortable : true
			} ] ],
			columns : [ [{
				title : '品牌',
				field : 'switch_manufacturer',
				width : 80
			}, {
				title : '型号',
				field : 'switch_type',
				width : 120
			}, {
				title : '序列号',
				field : 'switch_sn',
				width : 150
			}, {
				title : '资产编号',
				field : 'switch_asset_tag',
				width : 150
			}, {
				title : '使用状态',
				field : 'hardwarestatus_id',
				width : 100
			}, {
				title : '备注',
				field : 'comment',
				width : 100
			}, {
				title : '操作',
				field : 'content',
				width : 100,
				formatter : function(value, rowData, rowIndex) {
					return '<span class="icon-search" style="display:inline-block;vertical-align:middle;width:16px;height:16px;"></span><a href="javascript:void(0);" onclick="showcontent(' + rowIndex + ');">查看详细</a>';
				}
			}] ],
			toolbar :'#toolbar'
		});

	});

	function edit() {
		var rows = datagrid.datagrid('getSelections');
		if (rows.length == 1) {
			var p = parent.sy.dialog({
				title : '编辑网络设备信息',
				href : '/devices/switchedit?id=' + rows[0].id,
				width : 600,
				height : 350,
				buttons : [ {
					text : '编辑',
					handler : function() {
						var f = p.find('form');
						f.form('submit', {
							url : '/devices/switchsave',
							success : function(d) {
								var json = $.parseJSON(d);
								if (json.success) {
									datagrid.datagrid('reload');
									p.dialog('close');
								}
								parent.sy.messagerShow({
									msg : json.msg,
									title : '提示'
								});
							}
						});
					}
				} ],
				onLoad : function() {
					var f = p.find('form');
					f.form('load', {
						id : rows[0].id,
						switch_aliasname : rows[0].switch_aliasname,
						switch_sn : rows[0].switch_sn,
						switch_asset_tag : rows[0].switch_asset_tag,
						comment : rows[0].comment,
					});
				}
			});
		} else if (rows.length > 1) {
			parent.sy.messagerAlert('提示', '同一时间只能编辑一条记录！', 'error');
		} else {
			parent.sy.messagerAlert('提示', '请选择要编辑的记录！', 'error');
		}
	}
	function append() {
		var p = parent.sy.dialog({
			title : '添加设备信息',
			href : '/devices/switchadd',
			width : 600,
			height : 350,
			buttons : [ {
				text : '添加',
				handler : function() {
					var f = p.find('form');
					f.form('submit', {
						url : '/devices/switchsave',
						success : function(d) {
							var json = $.parseJSON(d);
							if (json.success) {
								datagrid.datagrid('reload');
								p.dialog('close');
							}
							parent.sy.messagerShow({
								msg : json.msg,
								title : '提示'
							});
						}
					});
				}
			} ]
		});
	};
	
	function del() {
		var rows = datagrid.datagrid('getChecked');
		var ids = [];
		if (rows.length > 0) {
			parent.sy.messagerConfirm('请确认', '您要删除当前所选项目？', function(r) {
				if (r) {
					for ( var i = 0; i < rows.length; i++) {
						ids.push(rows[i].id);
					}
					$.ajax({
						url : '/devices/switchdel',
						data : {
							id : ids.join(',')
						},
						dataType : 'json',
						success : function(d) {
							datagrid.datagrid('load');
							datagrid.datagrid('unselectAll');
							parent.sy.messagerShow({
								title : '提示',
								msg : d.msg
							});
						}
					});
				}
			});
		} else {
			parent.sy.messagerAlert('提示', '请勾选要删除的记录！', 'error');
		}
	}
	
	function undo() {
			datagrid.datagrid('clearSelections');
			datagrid.datagrid('unselectAll');	
	};
	
	//查看明细
	function showcontent(rowIndex) {
		var rows = datagrid.datagrid('getRows');
		var row = rows[rowIndex];

		var p = parent.sy.dialog({
			title : '设备明细 [' + row.title + ']',
			modal : true,
			maximizable : true,
			width : 900,
			height : 500,
			content : '<iframe src="/devices/switchdetail?id=' + row.id + '" frameborder="0" style="border:0;width:100%;height:99.4%;"></iframe>'
		});

		datagrid.datagrid('unselectAll');
	};
	
</script>
{{end}}

{{block bodyclass}}
<body class="easyui-layout" data-options="fit:true,border:false">
{{end}}

{{block content}}
	<div id="toolbar" style="display: none;">
		<table>
			<tr>
				<td><a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onclick="append();">添加</a></td>
				<td><a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true" onclick="del();">删除</a></td>
				<td><a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true" onclick="edit();">修改</a></td>
				<td><a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-undo',plain:true" onclick="undo();">取消选中</a></td>
				<td><div class="datagrid-btn-separator"></div></td>
				<td><input id="cr_name" name="cr_name" class="easyui-searchbox" style="width: 150px" data-options="searcher:function(value,name){datagrid.datagrid('load',{'cr_name':value});},prompt:'搜索机房名称'"></input></td>
				<td><a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'ext-icon-zoom_out',plain:true" onclick="$('#cr_name').searchbox('setValue','');datagrid.datagrid('load',{});">清空查询</a></td>
			</tr>
		</table>
	</div>
	<div data-options="region:'center',fit:true,border:false">
		<table id="grid" data-options="fit:true,border:false"></table>
	</div>
{{end}}
